<!-- 切割数据页 -->
<template>
  <div>
    <!-- 子表 -->
    <a-table :columns="childColums" @change="onChange" :data-source="dataSource" size="small"
      @resizeColumn="handleResizeColumn" :pagination="{
        position: ['bottomRight'],
        defaultPageSize: pageInfo.pageSize,
        total: total,
        current: pageInfo.currentPage,
        showQuickJumper: true,
        hideOnSinglePage: false,
        showTotal: (total, range) => ` 共 ${total} 条数据`,
      }" :scroll="{ y: windowHeight - 150, scrollToFirstRowOnChange: true }" :loading="loading" rowKey="projectJobId"
      class="ks-table">

      <template #bodyCell="{ column, index, record }">
        <!-- 序号 -->
        <template v-if="column.dataIndex === 'index'">
          {{ (pageInfo.currentPage - 1) * pageInfo.pageSize + index + 1 }}
        </template>
        <!-- 数据项 -->
        <template v-if="column.dataIndex === 'dataItems'">
          <a @click="viewDataItems(record)">查看</a>
        </template>
      </template>
    </a-table>

    <!-- 数据项列表--抽屉 -->
    <DataCuttingDrawer v-if="dialogVisible" @close="closeDialog" :ObjRecord="ObjRecord"></DataCuttingDrawer>
  </div>
</template>

<script>
import { DataTableMixin } from "@/mixins/DataTableMixin";
import {
  getSplitSegyTask
} from "@/api/dataDownloadPublish";
// import { message } from "ant-design-vue";
import DataCuttingDrawer from './components/DataCuttingDrawer'
export default {
  name: "DownloadableOrder",
  mixins: [DataTableMixin],
  components: {
    DataCuttingDrawer
  },
  props: {
    type: {
      type: String,
      default: "",
    },
  },
  data() {
    return {
      // 表头
      childColums: [
        {
          title: "序号",
          dataIndex: "index",
          width: 80,
          align: "center",
          show: true,
          resizable: true,
        },
        {
          title: "数据项",
          dataIndex: "dataItems",
          width: 100,
          align: "center",
          show: true,
          resizable: true,
        },
        {
          title: "项目名称",
          dataIndex: "projectName",
          align: "left",
          width: 600,
          show: true,
          resizable: true,
        },
      ],
      dataSource: [],
      dialogVisible: false,
      ObjRecord: {}
    };
  },
  methods: {
    handleResizeColumn(w, col) {
      col.width = w;
    },
    async getList() {
      try {
        this.loading = true;
        const _postParams = Object.assign(
          {},
          {
            jobState: [10],
          },
          this.pageInfo
        );
        const res = await getSplitSegyTask(_postParams)
        if (res) {
          // res?.data.forEach((item) => (item.radioOrder = false))
          let dataList = res?.data?.flatMap(item => item.projectJobs)
          this.dataSource = dataList
          // 页码信息
          this.pageInfo = {
            currentPage: res.currentPage,
            pageSize: res.pageSize,
          };
          this.total = res.totalSize;
        }
      } finally {
        this.loading = false
      }
    },
    // 查看订单数据项
    viewDataItems(record) {
      console.log('record', record);
      this.ObjRecord = record
      this.dialogVisible = true;
    },
    closeDialog() {
      this.dialogVisible = false;
    },
  },
};
</script>